<style scoped>
    .tools .shark {
        padding: 0 30px;
    }

    .tools .fast {
        font-size: 20px;
        color: #f39312;
        letter-spacing: 1px;
    }

    .tools .main .ivu-select,
    .main .ivu-input {
        border-radius: 0 2px 2px 0;
    }

    .tools .common-box-body {
        padding-top: 24px;
    }

    .tools .fixed-bottom {
        padding-left: 30px;
        padding-right: 40px;
        height: 80px;
        line-height: normal !important;
        position: fixed;
        left: 210px;
        right: 0;
        bottom: 0;
        z-index: 999;
        text-align: center;
        background-color: rgb(255, 255, 255);
        box-shadow: 0px 0px 9px 0px rgba(0, 0, 0, 0.28);
    }

    .tools .sidehide {
        left: 75px;
    }

    .tools .detail {
        margin-top: 20px;
        margin-bottom: 15px !important;
    }

    .tools .ivu-modal-mask .common-box-body .ivu-modal-body .ivu-form-item {
        text-align: center !important;
    }
</style>
<style>
    .tools .common-box-body .ivu-select-single .ivu-select-selection .ivu-select-placeholder,
    .common-box-body .ivu-select-single .ivu-select-selection .ivu-select-selected-value {
        padding-right: 0px;
    }

    .tools .ivu-tabs.ivu-tabs-card>.ivu-tabs-bar .ivu-tabs-tab {
        color: #2d8cf0;
        border-color: transparent;
        background-color: #FFF;
    }

    .tools .ivu-tabs.ivu-tabs-card>.ivu-tabs-bar .ivu-tabs-tab-active {
        color: #808080;
        border: 1px solid #dddee1;
        border-bottom: 0;
    }

    .tools button.ivu-btn {
        border-radius: 2px !important;
    }

    .tools.common-box-body .ivu-modal-body .ivu-form-item label {
        text-align: center !important;
    }
</style>


<template>
    <div class="tools" id="tools">
        <product-title></product-title>
        <div class="shark" style="padding:0 30px;">
            <div class="fast">快速搜索</div>
            <div class="common-box-body">
                <Form>
                    <Row>
                        <Col :md="24" :lg="6">
                        <Form-item>
                            <Select size="large" v-model="formdata.com_mid" placeholder="供应商简称" filterable :transfer="true">
                                <Option v-for="(item,index) in cname_list" :value="item.id" :key="item.id">{{item.shortn}}</Option>
                            </Select>
                        </Form-item>
                        </Col>

                        <Col :md="24" :lg="6">
                        <Form-item>
                            <Select placeholder="选择类型" v-model="formdata.type">
                                <Option value="保险公司核投保规则">保险公司核投保规则</Option>
                                <Option value="保险公司划款银行">保险公司划款银行</Option>
                                <Option value="保险公司保全规则">保险公司保全规则</Option>
                                <Option value="儿童年龄身高体重对照表">儿童年龄身高体重对照表</Option>
                            </Select>
                        </Form-item>
                        </Col>

                        <Col :md="24" :lg="4" offset="8">
                        <Button size="large" class="fr" type="primary" icon="ios-search" @click="search">搜索</Button>
                        </Col>
                    </Row>
                    <div style="border-bottom:1px solid #BEBEBE;"></div>
                    <Row style="margin-top:20px;">
                        <Col :md="24" :lg="6">
                            <div class="fast" style="color:red;text-decoration:underline;cursor:pointer;" @click="cmkg">
                                身高体重设置
                            </div>
                        </Col>
                        <Col :md="24" :lg="18">
                        <Button size="large" class="fr" v-if="$isShow('yun_org/create2')" type="warning" icon="plus" @click="addnewdoclist">新增</Button>
                        </Col>
                    </Row>
                </Form>
            </div>
            <div class="detail">
                <div class="clearfix">
                    <div class="table-theme highlight_table">
                        <Table ref="currentRowTable" @on-current-change="tableCurrentChange" size="large" stripe highlight-row border :columns="columns1"
                            :data="policylist" class=""></Table>
                    </div>
                </div>
            </div>
            <div :class="slidetoggle?'fixed-bottom':'fixed-bottom sidehide' ">
                <Row class="pro-pagesize">
                    <Col :md="24" :lg="12">
                    <Button type="error" :disabled="tableaction" size="large" class="fl mr10 " @click="remove">删除</Button>
                    <Button type="info" :disabled="tableaction" size="large" class="fl mr10" @click="toDetail">编辑</Button>
                    </Col>
                    <Col :md="24" :lg="12" class="tRight">
                    <Page :total="totals" ref='pages' :current="currentpage" show-total show-sizer :page-size="pagesize" @on-change="pageChange"
                        @on-page-size-change="pageSizeChange" placement="top" class="page"></Page>
                    </Col>
                </Row>
            </div>
        </div>
        <Modal v-model="showAddModal" :mask-closable="false" :closable="false" width="800" :title="title"
         class-name="common-box-body tools" id="showAddModal">
            <Row>
                <Col>
                <Form :model="modalData" ref="modalData" :rules="ruleValimodalData">
                    <Form-item label="类型" prop="type" required>
                        <Select placeholder="选择类型" v-model="modalData.type" transfer @on-change="typechange">
                            <Option value="保险公司核投保规则">保险公司核投保规则</Option>
                            <Option value="保险公司划款银行">保险公司划款银行</Option>
                            <Option value="保险公司保全规则">保险公司保全规则</Option>
                            <Option value="儿童年龄身高体重对照表">儿童年龄身高体重对照表</Option>
                        </Select>
                    </Form-item>
                    <Form-item label="供应商" prop="com_mid" v-if="yincang">
                        <Select size="large" v-model="modalData.com_mid" placeholder="供应商简称" filterable :transfer="true" @on-change="typechange1">
                            <Option v-for="(item,index) in cname_list" :value="item.id" :key="item.id">{{item.shortn}}</Option>
                        </Select>
                    </Form-item>
                    <Form-item>
                        <UE :defaultMsg="modalData.div_text" :config=config ref="div_text" id="div_text"></UE>
                    </Form-item>
                </Form>
                </Col>
            </Row>
            <div slot="footer" :md="24" :lg="8">
                <Button style="width:60px;" type="primary" size="small" @click="cancel">取消</Button>
                <Button style="width:60px;" class="tRight" type="success" size="small" long @click="add">确定</Button>
              </div>
        </Modal>
        <Modal v-model="showAddModal1" :mask-closable="false" :closable="false" width="800" :title="title1"
         class-name="common-box-body tools" id="showAddModal1">
            <Row>
                <Col>
                <Form :model="modalData1" ref="modalData1" :rules="ruleValimodalData1">
                    <Form-item label="类型" prop="type">
                        <!-- <Select placeholder="选择类型" v-model="modalData1.type" transfer> -->
                            <!-- <Option value="保险公司核投保规则">保险公司核投保规则</Option>
                            <Option value="保险公司划款银行">保险公司划款银行</Option>
                            <Option value="保险公司保全规则">保险公司保全规则</Option> -->
                            <!-- <Option value="">儿童年龄身高体重对照表</Option> -->
                        <!-- </Select> -->
                        <Input v-model="modalData1.type" placeholder="选择类型" disabled></Input>
                    </Form-item>
                    <Form-item>
                        <UE :defaultMsg="modalData1.div_text" :config=config ref="div_text1" id="div_text1"></UE>
                    </Form-item>
                </Form>
                </Col>
            </Row>
            <div slot="footer" :md="24" :lg="8">
                <Button style="width:60px;" type="primary" size="small" @click="cancel1">取消</Button>
                <Button style="width:60px;" class="tRight" type="success" size="small" long @click="add1">确定</Button>
              </div>
        </Modal>
    </div>
</template>

<script>
    import productTitle from '../../components/productTitle'
    import {
        _get_parter_list
    } from '../../api/product_v2'
    import {
        list,
        create,
        update,
        del,
        get_one,
        get_child
    } from '../../api/hot_tools'
    import UE from '../UE/ue.vue';

    import '../../../static/UEdit/ueditor.config.js';
    import '../../../static/UEdit/ueditor.all.js';
    import '../../../static/UEdit/lang/zh-cn/zh-cn.js';
    import '../../../static/UEdit/ueditor.parse.js';
    export default {
        data() {
            return {
                modalData1: {
                    type: "儿童年龄身高体重对照表",
                    div_text: "",
                },
                showAddModal1:false,
                ruleValimodalData1:{
                    com_mid: [{
                        required: true,
                        message: '不能为空',
                        // trigger: 'blur'
                        // pattern: /.+/, trigger: 'change'
                    }],
                    type: [{
                        required: true,
                        message: '不能为空',
                        // trigger: 'blur'

                    }],
                },
                yincang:true,
                id: "",
                config: {
                    initialFrameWidth: null,
                    initialFrameHeight: 350
                },
                title: '新增展业',
                title1:'身高体重对照表',
                cname_list: [],
                p: 1, //对页面页数的定义-->初始化
                pagesize: 10, //对页面的定义,出事定义10条数据
                totals: 0,
                showAddModal: false, //点击设置,弹出模态框
                closeable: false, //shif按ese按钮退出
                loading: true,
                loading1: true,
                tableaction: true,
                currentpage: 1,
                formdata: {
                    com_mid: '0',
                    type: "", //保险类型
                    p: 1, //对页面页数的定义-->初始化
                    pagesize: 10, //对页面的定义,出事定义10条数据
                },
                modalData: {
                    com_mid: "", //供应商id
                    type: "",
                    div_text: "",
                },
                policylist: [],
                columns1: [{
                        title: '供应商',
                        key: 'com_name',
                        align: 'center',
                    },
                    {
                        title: '类型',
                        key: 'type',
                        align: 'center',
                    },
                    {
                        title: '内容',
                        key: 'div_text',
                        align: 'center'
                    },
                ],
                ruleValimodalData: {
                    com_mid: [{
                        required: true,
                        message: '不能为空',
                        // trigger: 'blur'
                        // pattern: /.+/, trigger: 'change'
                    }],
                    type: [{
                        required: true,
                        message: '不能为空',
                        // trigger: 'blur'

                    }],
                },
                current: {}
            }
        },
        components: {
            productTitle,
            UE
        },
        computed: {
            slidetoggle() {
                return this.$store.state.sildeshow
            },
        },
        created() {},
        mounted() {
            this.getList();
            this.all_company();
        },
        methods: {
            getUEContent() {
                this.modalData.div_text = this.$refs.div_text.getUEContent();
            },
            getUEContent1() {
                this.modalData1.div_text = this.$refs.div_text1.getUEContent();
            },
            // 获取供应商服务
            all_company() {
                new Promise((resolve, reject) => {
                    _get_parter_list().then(res => {
                        if (res.data.err == 0) {
                            this.cname_list = res.data.data;
                        } else {
                            this.$Message.error(res.data.info);
                        }
                        resolve();
                    }).catch(error => {
                        reject(error);
                    })
                })
            },
            // 搜索
            search() {
                this.tableaction = true;
                this.formdata.p = 1;
                this.getList();
            },
            // 获取列表
            getList() {
                new Promise((resolve, reject) => {
                    list(this.formdata).then(res => {
                        if (res.data.err == 0) {
                            console.log(res, '......')
                            this.policylist = res.data.data.list;
                            this.totals = res.data.data.total;
                            this.tableaction = true;
                            if(this.policylist.length>0){
                                for(var i=0;i<this.policylist.length;i++){
                                    if(this.policylist[i].div_text.indexOf("&nbsp;")!=-1){
                                        this.policylist[i].div_text = this.policylist[i].div_text.replace(/&nbsp;/g,'')
                                    }
                                }
                            }
                        } else {
                            this.$Message.error(res.data.info);
                        }
                        resolve();
                    }).catch(error => {
                        reject(error);
                    })
                })
            },
            // 新增
            addnewdoclist() {
                this.current = {};
                this.modalData = {
                    com_mid: "", //供应商id
                    type: "",
                    div_text: "",
                };
                this.showAddModal = true;
            },
            // 页码改变
            pageChange(page) {
                this.p = page;
                this.formdata.p = page
                this.getList()
            },
            // 每页条数改变
            pageSizeChange(pagesize) {
                this.pagesize = pagesize;
                this.formdata.pagesize = pagesize;
                this.getList();
            },
            toDetail() {
                this.showAddModal = true;
                var _param = {
                    id: this.current.id
                }
                new Promise((resolve, reject) => {
                    get_one(_param).then(res => {
                        if (res.data.err == 0) {
                            this.modalData = res.data.data;
                            this.$refs.div_text.setUEContent(this.modalData.div_text)
                        } else {
                            this.$Message.error(res.data.info);
                        }
                        resolve();
                    }).catch(error => {
                        reject(error);
                    });
                });
            },
            // 选中表单的其中一项,进行数据删除处理
            //选中当前行数据
            tableCurrentChange(currentRow, oldCurrentRow) {
                this.tableaction = false;
                this.current = currentRow;
            },
            // 删除数据
            remove() {
                this.$Modal.confirm({
                    title: '提示',
                    content: '是否要删除该条记录?',
                    onOk: () => {
                        var _param = {
                            id: this.current.id
                        }
                        console.log(_param, '.._param')
                        new Promise((resolve, reject) => {
                            del(_param).then(response => {
                                if (response.data.err == 0) {
                                    this.$Message.success(response.data.info);
                                    this.getList();

                                } else {
                                    this.$Message.error(response.data.info);
                                }
                                resolve();
                            }).catch(error => {
                                reject(error);
                            });
                        });
                    },

                });
            },
            // creaTE 点击确定弹窗按钮
            add() {
                this.getUEContent();
                console.log(this.modalData, "...")
                this.$refs['modalData'].validate((valid) => {
                    if (valid) {
                        if (this.modalData.div_text == "" || this.modalData.div_text == null) {
                            this.$Message.error('请编辑富文本信息');
                            return false;
                        }
                        if (this.current.id) {
                            // 编辑
                            new Promise((resolve, reject) => {
                                update(this.modalData).then(response => {
                                    if (response.data.err == 0) {
                                        this.showAddModal = false;
                                        this.$Message.success(response.data.info);
                                        this.$refs["modalData"].resetFields();
                                        this.$refs.div_text.setUEContent('')
                                        // this.modalData.com_mid = '';
                                        // this.modalData.type = '';
                                        this.getList()
                                        // location.reload();

                                    } else {
                                        this.$Message.error(response.data.info);
                                        this.loading = false;
                                    }
                                    resolve();
                                }).catch(error => {
                                    reject(error);
                                });
                            });
                        } else {
                            // 新增
                            new Promise((resolve, reject) => {
                                create(this.modalData).then(response => {
                                    if (response.data.err == 0) {
                                        this.showAddModal = false;
                                        this.$Message.success(response.data.info);
                                        this.$refs["modalData"].resetFields();
                                        this.$refs.div_text.setUEContent('');
                                        this.getList();
                                        // location.reload();

                                    } else {
                                        this.$Message.error(response.data.info);
                                        this.loading = false;
                                    }
                                    resolve();
                                }).catch(error => {
                                    reject(error);
                                });
                            });
                        }
                    } else {
                      
                    }
                })
            },
            cancel() {
                this.$refs['modalData'].resetFields();
                this.$refs.div_text.setUEContent('');
                this.showAddModal = false;
            },
            cancel1() {
                this.$refs.div_text1.setUEContent('');
                this.showAddModal1 = false;
            },
            typechange(val){
                if(val=='儿童年龄身高体重对照表'){
                    this.modalData.com_mid="";
                    this.yincang=false;
                }else{
                    this.yincang=true;
                }
            },
            typechange1(){
                if(this.modalData.type=="儿童年龄身高体重对照表"){
                    this.$nextTick(function(){
                        this.modalData.com_mid="";
                    })
                }
            },
            cmkg(){
                this.showAddModal1 = true;
                this.get_cmkg();
            },
            add1(){
                this.getUEContent1();
                 if (this.modalData1.div_text == "" || this.modalData1.div_text == null) {
                            this.$Message.error('请编辑富文本信息');
                            return false;
                }
                if(this.modalData1.id){
                    new Promise((resolve, reject) => {
                                update(this.modalData1).then(response => {
                                    if (response.data.err == 0) {
                                        this.showAddModal1 = false;
                                        this.$Message.success(response.data.info);
                                        this.$refs.div_text1.setUEContent('');
                                        this.getList();

                                    } else {
                                        this.$Message.error(response.data.info);
                                        this.loading = false;
                                    }
                                    resolve();
                                }).catch(error => {
                                    reject(error);
                                });
                            });
                }else{
                     // 新增
                            new Promise((resolve, reject) => {
                                create(this.modalData1).then(response => {
                                    if (response.data.err == 0) {
                                        this.showAddModal1 = false;
                                        this.$Message.success(response.data.info);
                                        this.$refs.div_text1.setUEContent('');
                                        this.getList();
                                        // location.reload();
                                    } else {
                                        this.$Message.error(response.data.info);
                                        this.loading1 = false;
                                    }
                                    resolve();
                                }).catch(error => {
                                    reject(error);
                                });
                            });
                }
                       
                           
                    
            },
            get_cmkg(){
                new Promise((resolve, reject) => {
                    get_child().then(res => {
                        if (res.data.err == 0) {
                            this.modalData1 = res.data.data;
                            this.$refs.div_text1.setUEContent(this.modalData1.div_text)
                        } else {
                            this.$Message.error(res.data.info);
                        }
                        resolve();
                    }).catch(error => {
                        reject(error);
                    });
                });
            }
        },
    }
</script>